﻿<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Live Connect Sample</title>
    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.2.min.js" type="text/javascript"></script>
    <script src="https://js.live.net/v5.0/ja/wl.js" type="text/javascript"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Label ID="AccessTokenLabel" runat="server" Text="Label"></asp:Label>
        <br />
        <asp:Label ID="BasicInfoLabel" runat="server" Text="Label"></asp:Label>
    </div>
    </form>
    <div id="WLSignin"></div>
    <div id="Profile" style="height: 150px;">
        <img id="Picture" alt="Picture" title="Picture" style="width: 100px; height: 100px;" />
        <div id="UserName"></div>
    </div>
    <script type="text/javascript">
        //<![CDATA[
        var clientId = "00000000480DCFD1";
        //var redirectUri = "http://tempuri.org/OAuthWeb/";

        $(function () {
            log("サインインしてください。");
            $("#Profile").hide();

            WL.Event.subscribe("auth.login", onLogin);
            WL.Event.subscribe("auth.logout", onLogout);
            WL.Event.subscribe("auth.sessionChange", onSessionChange);

            WL.init({ client_id: clientId });
            //WL.init({ client_id: clientId, redirect_uri: redirectUri });
            WL.ui({ name: "signin", element: "WLSignin" });

            function onLogin() {
                var session = WL.getSession();
                if (!session) return;

                WL.api({ path: "me", method: "GET" })
                    .then(function (response) {
                        $("#UserName").text(response.name);
                    }, function (responseFailed) {
                        log("Error calling API: " + responseFailed.error.message);
                    });

                WL.api({ path: "me/picture", method: "GET" })
                    .then(function (response) {
                        $("#Picture").attr("src", response.location);
                    }, function (responseFailed) {
                        log("Error calling API: " + responseFailed.error.message);
                    });

                $("#Profile").show();
            }

            function onLogout() {
                $("#Profile").hide();
            }

            function onSessionChange() {
                var session = WL.getSession();
                if (!session) return;
                log("Your session has changed.");
            }

            function log(message) {
                var child = document.createTextNode(message);
                var parent = document.getElementById('JsOutputDiv') || document.body;
                parent.appendChild(child);
                parent.appendChild(document.createElement("br"));
            }
        });
        //]]>
    </script>
</body>
</html>
